<template>
  <div>
    <el-row>
        <el-checkbox-group v-model="options.checkedValues" @change="handlerCheckedChange" >
            <template v-if="!(options.data.length === 0)">
                <el-checkbox  v-for="(v,k) in options.data" :label="k" :key="k">{{v}}</el-checkbox>
            </template>
        </el-checkbox-group>
    </el-row>
  </div>
</template>
<script lang="ts">
import {Component, Emit, Prop, Vue} from 'vue-property-decorator';

@Component
export default class SubTableProp extends Vue{

    @Prop({ default: {}}) 
    private options!: any;


    @Emit('change')
    handlerCheckedChange(val:any){

        let hck = {};
        for(let dt in this.options.data){
            if(val.includes(dt)){
                hck[dt] = this.options.data[dt];
            }
        }
        return JSON.stringify(hck);
    }
  
}
</script>